<?php
/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
include('./includes/dbconnection.php'); // open db connection

$result = mysql_query("SELECT * FROM Assets ORDER BY Path") or die(mysql_error());
/*
while($row = mysql_fetch_array($result)){
    echo $row['Title']."\n";
}
*/
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>


        <meta http-equiv="content-type" content="text/html; charset=utf-8">

        <style type="text/css">
            /*margin and padding on body element
            can introduce errors in determining
            element position and are not recommended;
            we turn them off as a foundation for YUI
            CSS treatments. */
            body {
                margin:0;
                padding:0;
            }
        </style>

        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/container/assets/skins/sam/container.css">
        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/fonts/fonts-min.css" />
        <link rel="stylesheet" href="http://yui.yahooapis.com/2.7.0/build/reset-fonts-grids/reset-fonts-grids.css" type="text/css">
        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/treeview/assets/skins/sam/treeview.css" />


<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/dragdrop/dragdrop-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/treeview/treeview-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/container/container-min.js"></script>
<script type="text/javascript" src="../jquery-1.3.2.js"></script>


        <script type="text/javascript" src="../jquery-1.3.2.js"></script>



        <!--begin custom header content for this example-->
        <style>
            #treeDiv1 {background: #fff; padding:1em;}
        </style>
        <!--end custom header content for this example-->

        <style tyle="text/css">
            #custom-doc { width: 100%; min-width: 250px; }


            #example {height:20em;}

            /* Aqua Panel Skin CSS */

            /* Provide skin for default Panel elements, ontop of container-core.css */
            #myPanel_c.yui-panel-container.shadow .underlay {
                position:absolute;
                left:3px;
                right:-3px;
                top:3px;
                bottom:-3px;
                background-color:#000;
                opacity:0.12;
                filter:alpha(opacity=12);
            }
            #myPanel.yui-panel {
                border:none;
                overflow:visible;
                background-color:transparent;
            }
            #myPanel.yui-panel .container-close {
                position:absolute;
                top:3px;
                left:4px;
                height:18px;
                width:17px;
                background:url(img/aqua-hd-close.gif) no-repeat;
            }

            /* span:hover not supported on IE6 */
            #myPanel.yui-panel .container-close:hover {
                background:url(img/aqua-hd-close-over.gif) no-repeat;
            }
            #myPanel.yui-panel .hd {
                padding:0;
                border:none;
                background:url(img/aqua-hd-bg.gif) repeat-x;
                color:#000;
                height:22px;
                margin-left:6px;
                margin-right:6px;
                text-align:center;
                overflow:visible;
            }
            #myPanel.yui-panel .bd {
                overflow:hidden;
                padding:4px;
                border:1px solid #aeaeae;
                background-color:#FFF;
            }
            #myPanel.yui-panel .ft {
                font-size:75%;
                color:#666;
                padding:2px;
                overflow:hidden;
                border:1px solid #aeaeae;
                border-top:none;
                background-color:#dfdfdf;
            }

            /* Provide skin for custom elements */
            #myPanel.yui-panel .hd span {
                vertical-align:middle;
                line-height:22px;
                font-weight:bold;
            }
            #myPanel.yui-panel .hd .tl {
                width:7px;
                height:22px;
                top:0;
                left:0px;
                background:url(img/aqua-hd-lt.gif) no-repeat;
                position:absolute;
            }
            #myPanel.yui-panel .hd .tr {
                width:7px;
                height:22px;
                top:0;
                right:0px;
                background:url(img/aqua-hd-rt.gif) no-repeat;
                position:absolute;
            }
        </style>




        <script type="text/javascript">
        function refreshFiles(){
               /*  $("#browser").load("filetry_2.php"); */
            }


            $(document).ready(function() {
                refreshFiles();
                myPanel = new YAHOO.widget.Panel("myPanel",{
                    width: "400px",
                    fixedcenter: true,
                    constrainviewport: true,
                    close: true,
                    draggable: true,
                    underlay: "shadow",
                    modal: true,
                    visible: false
                });

                myPanel.beforeHideEvent.subscribe(function(e,a,o){
                    // TODO: check input
                });

                myPanel.render();


                var onUploadButtonClick = function(e){
                    YAHOO.util.Connect.setForm('uploadForm', true);  // second arg, is file upload form

                    var uploadHandler = {
                        upload: function(o) {
                            // alert(o.responseText);
                            myPanel.hide()

                            // refreshFiles();
                            window.location.reload();
                        }
                    };

                    YAHOO.util.Connect.asyncRequest('POST', 'upload.php', uploadHandler);
                };

                var onCancelButtonClick = function(e){
                    $("#uploadTitle").val("");
                    $("#uploadDescription").val("");
                    $("#uploadFile").val("");
                    $("#uploadPath").val("");
                    myPanel.hide();
                };


                var onDeleteButtonClick = function(e){

                };

                YAHOO.util.Event.on('uploadButton', 'click', onUploadButtonClick);
                YAHOO.util.Event.on('cancelButton','click',onCancelButtonClick);
            });



            var clientClickTest = function (){
                alert("client click test");
            }


            YAHOO.util.Event.addListener("testLink", "click", clientClickTest);


            //global variable to allow console inspection of tree:
            var tree;

            //anonymous function wraps the remainder of the logic:
            (function() {

                //function to initialize the tree:
                function treeInit() {
                    //    buildRandomTextNodeTree();
                    tree = new YAHOO.widget.TreeView("treeDiv1");

                    // construct file tree...
                    // start with the pathNode being the tree root node.
                    // when different path encountered, create new node and
                    // attach nodes off of that
                    // Use PHP to generate the Javascript code to do this

<?php
$currPath="";
echo "pathNode = tree.getRoot()\n";
while($row = mysql_fetch_array($result)){
    if($row['Path'] != $currPath){
        echo 'var pathNode = new YAHOO.widget.TextNode("';
        echo $row['Path'];
        echo "\", tree.getRoot(), false);\n";

        $currPath=$row['Path'];
    }

    echo "var myobj = { label:\"".$row['Title']."\" ";
    echo ", myNodeId: \"".$row['ID']."\"};\n";
    echo 'var myNode = new YAHOO.widget.TextNode(';
    echo "myobj";
    echo ', pathNode, false);'."\n";
}
?>

            //            buildLargeBranch(myNode);

            // Trees with TextNodes will fire an event for when the label is clicked:

            function changeFileView(node){
                YAHOO.log(node.index + " label was clicked", "info", "example");
                if( node.hasChildren(false) == false){
                    // node.data.myNodeId has the ID number
                    // from the database for the picture, etc

                    $("#fileviewer").load("trydisplay.php?fileID="+node.data.myNodeId);


                }
            }
            
            tree.subscribe("labelClick", function(node) {
               changeFileView(node);
            });

            tree.subscribe("highlightEvent", function(node) {
                alert("highlight");
               // changeFileView(node);
            });

            tree.subscribe("focusChanged", function(node) {
                // alert("focus");
               // changeFileView(node);
            });

/*
            tree.subscribe("enterKeyPressed", function(node) {
                alert("Enterkey");
               // changeFileView(node);
            });

*/

            $("#msg").ajaxError(function(event, request, settings){
                $(this).append("<li>Error requesting page " + settings.url + "</li>");
            });

            tree.draw();

        }

        //Add an onDOMReady handler to build the tree when the document is ready
        YAHOO.util.Event.onDOMReady(treeInit);

    })();

        </script>





    </head>

    <body>
        <div id="doc3" class="yui-t7">
            <div id="hd"></div>
            <!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
            <div id="bd">
                <div class="yui-gd">
                    <div class="yui-u first">
                        <button onclick='myPanel.show()'>Upload</button>

                        <div id="treeDiv1"> </div>
                        <div id="msg"><span /></div>
                    </div>
                    <div class="yui-u">
                        <div id="fileviewer"><span /></div>
                    </div>
                </div>
            </div>

            <!--END SOURCE CODE FOR EXAMPLE =============================== -->
            <div id="ft"></div>
        </div>

        <div id="myPanel">
            <div class="hd"><div class="tl"></div><span>File Upload</span><div class="tr"></div></div>
            <div class="bd">
                Please select a file to upload:
                <form action="upload.php" enctype="multipart/form-data" method="post" id="uploadForm">
                    <input type="file" name="file" id="uploadFile" /><br>
                    <label>Title:</label><input type="text" name="Title" id="uploadTitle" /><br/>
                    <label>Descripiton:</label><input type="text" name="Description" id="uploadDescription" /><br/>
                    <label>Path:</label><input type="text" name="Path" id="uploadPath"><br/>
                    <input type="button" id="cancelButton" value="Cancel"/>
                    <input type="button" id="uploadButton" value="Done"/>
                </form>
            </div>
            <div class="ft">&nbsp;</div>
        </div>

    </body>
</html>

